<template>
	<div>
		<div class="cart_body" v-for="(it, index) in sendList" @click="clickTo(it.status, it.workNo, tabState)" :key="index">
			<div class="cardBox">
				<div class="cart_left"><img :src="imgUrl + it.goodsImg" /></div>
				<div class="cart_right">
					<p class="title">
						<span class="godname u-line-1">{{ it.goodsName }}</span>
						<span class="statusSpan showSpan" v-if="it.status == '抢单' || it.status == '不合格'">{{ it.status }}</span>
						<span class="sureReceive showSpan" v-if="it.status == '已报名' || it.status == '退单'">{{ it.status }}</span>
						<span class="sureRece showSpan" v-if="it.status == '确认接单'">{{ it.status }}</span>
						<span class="showSpan upDays" v-if="tabState == 1">剩余{{ it.upDay }}</span>
						<span class="showSpan overOrder" v-if="tabState == 2">{{ it.planProcessOverDate }}</span>
					</p>
					<p>工单编号：{{ it.workNo }}</p>
					<p>
						 
								<span>款号：{{ it.goodsItemNo }}</span>
							 
								<span>总数：{{ it.workNum }}件</span>
							 
					</p>
					<p> 
						<span>交期：{{ it.replyDeliveryDate }}</span>
						 
						<span>价格：{{ it.machiningPrice }}元</span>
						 
					</p>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	props: ['sendList', 'tabState'],
	data() {
		return { imgUrl: 'http://files.ybangy.net/' };
	},
	methods: {
		clickTo(val, no, tabState) {
			let url = '';
			console.log('////', val, no, tabState);
			if (tabState == 0) {
				switch (val) {
					// 不合格 pages/workOrder/noquaFiled
					case '不合格':
						url = '/pages/workOrder/noquaFiled?workNo=' + no + '&status=' + val + '&tabState=' + tabState;
						break;
					// 确认接单
					case '确认接单':
						url = '/pages/workOrder/noquaFiled?workNo=' + no + '&status=' + val + '&tabState=' + tabState;
					//抢单
					case '抢单':
						url = '/pages/workOrder/noquaFiled?workNo=' + no + '&status=' + val + '&tabState=' + tabState;
					//退单
					case '退单':
						url = '/pages/workOrder/noquaFiled?workNo=' + no + '&status=' + val + '&tabState=' + tabState;
					case '已报名':
						url = '/pages/workOrder/noquaFiled?workNo=' + no + '&status=' + val + '&tabState=' + tabState;
				}
				uni.navigateTo({
					url
				});
			} else if (tabState == 2 || tabState == 1) {
				let url = '/pages/workOrder/noquaFiled?workNo=' + no + '&tabState=' + tabState;
				uni.navigateTo({
					url
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.cart_body {
	padding: 15rpx 35rpx;
	.cardBox {
		display: flex;
		// border: 1px solid #C0C0C0;
		border-radius: 10upx;
		box-shadow: 0px 2px 11px 0px rgba(192, 192, 192, 0.5);
		padding: 30upx 20upx;
	}
	.cart_left {
		margin-right: 30rpx;
		img {
			border-radius: 10rpx;
			width: 140rpx;
			height: 180rpx;
		}
	}
	.cart_right {
		width: 100%;
		font-size: 24rpx;
		color: #777;
		display: flex;
		justify-content: space-between;
		padding: 0 0 10rpx 0;
		flex-direction: column;
		.title {
			font-weight: 500;
			color: #333;
			font-size: 28rpx;
		}
		.upDays {
			background-color: #ff3e3e;
			color: #ffffff;
		}
		.overOrder {
			background-color: #7f7f7f;
			color: #ffffff;
		}
		p {
			display: flex;
			span {
				margin-right: 20rpx;
			}
			.godname {
				flex: 5;
				margin-right: 0px;
			}
			.showSpan {
				text-align: center;
				// box-shadow:0px 2px 11px 0px rgba(192,192,192,0.5);
				padding: 0 15rpx;
				border-radius: 10rpx;
				flex: 2;
				font-size: 20rpx;
				line-height: 40rpx;
			}
			.statusSpan {
				background: rgba(255, 240, 239, 1);
				border: 1px solid rgba(255, 171, 166, 1);
				color: #ff3b30;
			}
			.sureReceive {
				background: rgba(255, 168, 115, 0.05);
				border: 1px solid rgba(255, 168, 115, 1);
				color: #ffa873;
			}
			.sureRece {
				background: rgba(123, 195, 40, 0.05);
				border: 1px solid rgba(123, 195, 40, 1);
				color: #7bc328;
			}
		}
	}
}
</style>
